import React  from 'react';
import {Text, View, Image, TouchableHighlight, StyleSheet, TouchableOpacity} from 'react-native';

export default class ViewUtils {
  /**
   * 
   * @param {单机item的回调} callBack 
   * @param {左侧图标} icon 
   * @param {显示的文本} text 
   * @param {图标着色} tintStyle 
   * @param {右侧图标} expandableIcon 
   */
  static getSettingItem (callBack, icon, text, tintStyle, expandableIcon) {
    return (
      <TouchableHighlight
        onPress={callBack}
      >
        <View style={styles.item}> 
          <View style={{flexDirection: 'row', alignItems: 'center'}}>
            <Image source={icon} style={[{width: 16, height: 16, marginRight: 10}, tintStyle]} resizeMode="stretch"/>
            <Text>{text}</Text>
          </View>
          <Image source={expandableIcon?expandableIcon:require('../images/ic_tiaozhuan.png')} style={[{
            marginRight: 10,
            height: 22,
            width: 22
          }, tintStyle]}/>
        </View>
      </TouchableHighlight>
    )
  }

  static getLeftButton(callBack) {
    return <TouchableOpacity
        style={{padding: 8}}
        onPress={callBack}>
        <Image
            style={{width: 26, height: 26,}}
            source={require('../images/ic_arrow_back_white_36pt.png')}/>
    </TouchableOpacity>
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  item: {
    backgroundColor: '#fff',
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    padding: 10,
    height:60
  }
})